<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Themes</title>
    <link href="https://cdn.bootcss.com/twitter-bootstrap/4.3.1/css/bootstrap.min.css" rel="stylesheet">
    <link rel="stylesheet" href="css/style.css">
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
</head>
<body>

<header>
    <div class="container">
        <nav class="navbar navbar-light">
            <a class="navbar-brand">Themes</a>
            <div class="nav">
                <a class="nav-link active" href="#">Themes</a>
                <a class="nav-link" href="#">About</a>
                <a class="nav-link" href="#">FAQ</a>
            </div>
        </nav>
    </div>
</header>
<main>
    <div class="container text-center">
        <h1><a href="#" class="logo">B</a></h1>
        <h2 class="h1">Themes</h2>
        <p class="text">Customize and extend</p>
        <button type="button" class="btn explore">Explore</button>
        <div class="example">
            <div class="row">
                <div class="col-md-4">
                    <img src="img/a.png" alt="">
                    <h3 class="h5">Components and examples</h3>
                    <p>Each theme features new components</p>
                </div>
                <div class="col-md-4">
                    <img src="img/b.png" alt="">
                    <h3 class="h5">Tons of variables</h3>
                    <p>Theme components inherit much</p>
                </div>
                <div class="col-md-4">
                    <img src="img/c.png" alt="">
                    <h3 class="h5">Source files and tools</h3>
                    <p>Each theme includes components</p>
                </div>
            </div>
        </div>
        <div class="team">
            <h4>Team</h4>
            <div class="row">
                <div class="col-md-4">
                    <div class="bk bk-1">
                        <img src="img/avatar-fat.jpg" alt="">
                        <div>
                        <p>Jacob Thornton<br>Creator of Bootstrap,engineer at Twitter<br>& Medium.Founder of Bumpers.</p>
                        <button type="button" class="btn explore">View GitHub</button>
                        </div>
                    </div>
                </div>
                <div class="col-md-4">
                    <div class="bk bk-2">
                        <img src="img/avatar-mdo.jpg" alt="">
                        <div>
                        <p>Jacob Thornton<br>Creator of Bootstrap,engineer at Twitter<br>& Medium.Founder of Bumpers.</p>
                        <button type="button" class="btn explore">View GitHub</button>
                        </div>
                    </div>
                </div>
                <div class="col-md-4">
                    <div class="bk bk-3">
                        <img src="img/avatar-dhg.png" alt="">
                        <div>
                            <p>Jacob Thornton<br>Creator of Bootstrap,engineer at Twitter<br>& Medium.Founder of Bumpers.</p>
                            <button type="button" class="btn explore"> View GitHub</button>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="check text-left navbar">
            <div>
                <h5>C'mon check out thet themes</h5>
                <p>Now you know what we're about,so peep the goods!</p>
            </div>
            <button type="button" class="btn explore">Explore</button>
        </div>
    </div>
</main>
<footer>
    <div class="container">
        <ul class="nav justify-content-center">
            <li class="nav-item">
                <a class="nav-link active" href="#">About</a>
            </li>
            <li class="nav-item">
                <a class="nav-link" href="#">Terms</a>
            </li>
            <li class="nav-item">
                <a class="nav-link" href="#">Privacy</a>
            </li>
            <li class="nav-item">
                <a class="nav-link active" href="#">Licenses</a>
            </li>
            <li class="nav-item">
                <a class="nav-link" href="#">FAQ</a>
            </li>
            <li class="nav-item">
                <a class="nav-link" href="#">Bootstrap</a>
            </li>
        </ul>
    </div>
</footer>



<script src="https://cdn.bootcss.com/jquery/3.3.1/jquery.slim.min.js"></script>
<script src="https://cdn.bootcss.com/popper.js/1.14.7/umd/popper.min.js"></script>
<script src="https://cdn.bootcss.com/twitter-bootstrap/4.3.1/js/bootstrap.min.js"></script>
</body>
</html>